<!--
 * @Author: 陈俊升 761723995@qq.com
 * @Date: 2023-07-19 11:22:15
 * @LastEditors: 陈俊升 761723995@qq.com
 * @LastEditTime: 2023-11-29 09:00:57
 * @FilePath: /hr_new_vue3/src/views/Management/Contract/ContractCenter/Files/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!-- 合同-合同中心-合同档案库 -->
<template>
  <ContentCard>
    <template #header>
      <PageHeaderNew
        :title="userData.name + '的合同档案'"
        :breadCrumb="['合同', '合同中心', '合同档案库']"
        :showBack="true"
      />
    </template>
    <a-tabs
      lazy-load
      v-model:active-key="tableType"
      @change="refUserTable.loadData()"
    >
      <a-tab-pane
        :key="index + 1"
        :title="item"
        v-for="(item, index) in [
          '全部合同',
          '变更合同',
          '解除合同',
          '变更合同'
        ]"
      />
    </a-tabs>
    <table-turn
      style="height: 100%"
      :tableData="getTableData"
      ref="refUserTable"
    >
      <a-table-column :width="80">
        <template #title> 序号 </template>
        <template #cell="{ rowIndex }">
          {{ rowIndex + 1 }}
        </template>
      </a-table-column>
      <a-table-column
        :width="150"
        title="合同名称"
        data-index="contract.contractName"
      />
      <a-table-column
        :width="150"
        title="合同编号"
        data-index="contract.contractNum"
      />
      <a-table-column :width="150" title="合同类型">
        <template #cell="{ record }">
          {{
            typeList.find((item) => item.id === record.contract.typeId)?.name
          }}
        </template>
      </a-table-column>
      <a-table-column
        :width="150"
        title="合同公司"
        data-index="contract.companyId"
      >
        <template #cell="{ record }">
          {{
            companyList.find((item) => item.id === record.contract.companyId)
              ?.name
          }}
        </template>
      </a-table-column>
      <!-- <a-table-column :width="150" title="发起人" data-index="userName">
      </a-table-column> -->
      <a-table-column
        :width="150"
        title="发起签署时间"
        data-index="contract.startTime"
      />
      <a-table-column :width="150" title="状态" data-index="status">
        <template #cell="{ record }">
          <div
            :style="{
              color: contractUserStatus.find(
                ({ value }) => value === record.contract.status
              )?.color
            }"
          >
            {{
              contractUserStatus.find(
                ({ value }) => value === record.contract.status
              )?.text || '-'
            }}
          </div>
        </template>
      </a-table-column>
      <a-table-column :width="120" title="操作" fixed="right">
        <template #cell="{ record }">
          <a-link @click="toUserContractList(record)"> 查看详情 </a-link>
        </template>
      </a-table-column>
    </table-turn>
  </ContentCard>
</template>

<script lang="ts" setup>
import { GetWaitSignedContractList } from '@/apis/management/contract/contractManagement/waitSigned';
import { GetLegalEntityList } from '@/apis/management/organization/organizationManagement/LegalEntity/index';
import { GetContractGroup } from '@/apis/management/contract/baseSetting';
import { GetMyContractPage } from '@/apis/management/contract/contractManagement/haveSigned';

import { contractUserStatus } from '@/utils/dictionary/contract';

let router = useRouter();

let toUserContractList = (record: any) => {
  localStorage.setItem('UserContractData', JSON.stringify({ ...record }));
  // router.push({ name: 'ContractDetails' });
};

let tableType = ref(1);
// 加载用户列表
let refUserTable = ref();
const getTableData = async (pageData?: any) => {
  try {
    let res = await GetMyContractPage({
      ...pageData,
      id: userData.id,
      type: tableType.value
    });
    return Promise.resolve(res);
  } catch (error: unknown) {
    console.log(error);
  }
};

//加载基础数据
let userData = reactive<any>({});
let typeList = ref<any[]>([]);
let companyList = ref<any[]>([]);
let loadData = async () => {
  try {
    Object.assign(
      userData,
      JSON.parse(localStorage.getItem('UserContractData') + '')
    );
  } catch (err) {
    //
  }
  let [contractType, legalEntity] = await Promise.all([
    GetContractGroup({
      pageNumber: 0,
      pageSize: -1
    }),
    GetLegalEntityList({ pageNumber: 0, pageSize: -1 } as any)
  ]);
  typeList.value = contractType?.content || [];
  companyList.value = legalEntity?.content || [];
};
loadData();
</script>

<style scoped lang="less">
.contractHead {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 10px;
  padding-left: 15px;
  padding-right: 15px;
  &-title {
    font-size: 18px;
    font-weight: 600;
  }
}
</style>
